.main {
    margin: 4em auto;
    position: relative;
    width: 80%;
}

.none {
    display: none;
}

.thumbScale {
    -webkit-animation: scaleIt 1s ease-in-out alternate;
    animation: scaleIt 1s ease-in-out alternate;
    -webkit-animation-iteration-count: 1;
}

@-webkit-keyframes scaleIt {
    0% {
        transform: scale(1);
    }
    25% {
        transform: scale(1.1);
    }
    50% {
        transform: scale(1.2);
    }
    75% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

.addOne {
    display: block !important;
    -webkit-animation: addIt 1.5s ease-in-out alternate;
    animation: addIt 1.5s ease-in-out alternate;
    -webkit-animation-iteration-count: 1;
    /* Safari 和 Chrome */
    font-size: 40px;
    color: #FF1177;
    position: absolute;
    left: 20%;
    top: 10%;
}

@-webkit-keyframes addIt {
    from {
        opacity: 0;
        -webkit-transform: translateY(-20px);
        text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #FF1177, 0 0 70px #FF1177, 0 0 80px #FF1177, 0 0 100px #FF1177, 0 0 150px #FF1177;
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0);
         text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #FF1177, 0 0 35px #FF1177, 0 0 40px #FF1177, 0 0 50px #FF1177, 0 0 75px #FF1177;
    }
}